<template>
  <div>
    <zm-dialog
      :title="Title"
      :visible.sync="value"
      append-to-body
      :before-close="dialogClose"
      :close-on-click-modal="false"
      :keep-alive="true"
    >
      <zm-form :model="form" ref="form" :rules="rules" label-width="100px" label-position="left" class="ml20">
        <zm-form-item label="分组名称" prop="name">
          <zm-input v-model.trim="form.name" class="w260"></zm-input>
        </zm-form-item>
      </zm-form>
      <div slot="footer" class="tr">
        <zm-button @click="dialogClose" type="info">取消</zm-button>
        <zm-button @click="onSave" type="primary">确定</zm-button>
      </div>
    </zm-dialog>
  </div>
</template>
<script>
import dialogMixin from '@/mixins/dialogMixin'
import productCategoryApis from '@/api/src/productCategory'
export default {
  // 一级分组
  name: 'AddProductVue',
  components: {},
  mixins: [dialogMixin],
  props: {
    rowObj: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data () {
    return {
      form: {
        name: ''
      },
      rules: {
        name: [{required: true, message: '请输入名称', trigger: 'blur'}]
      }
    }
  },
  computed: {
    Title () {
      return this.rowObj.type === 'edit' ? '编辑一级分组' : '新增一级分组'
    }
  },
  watch: {},
  created () {
    this.init()
  },
  methods: {
    init () {
      if (this.rowObj.type === 'edit') {
        this.form.name = this.rowObj.row.name
      }
    },
    async onSave () {
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          if (this.rowObj.type === 'create') {
            await productCategoryApis.create({
              name: this.form.name
            })
          } else {
            await productCategoryApis.update({
              name: this.form.name,
              id: this.rowObj.row.id
            })
          }
          this.$emit('handle-after')
          this.dialogClose()
        }
      })
    }
  }
}
</script>
<style scoped lang='scss'>
</style>
